{% extends 'base_no_cart_count.html' %}
{% load staticfiles %}
{% block title %}天天生鲜-提交订单{% endblock title %}
{% block topfiles %}
    <script src="{% static 'js/jquery-1.12.4.min.js' %}"></script>
    <script>
    $(function () {
        // 记录商品的数目和总价格
        goods_total_count = 0
        goods_total_price = 0
        $('.goods_list_td').each(function () {
            // 1.获取当前商品的价格
            goods_price = $(this).children('.col05').text()
            goods_price = parseFloat(goods_price)
            // 2.获取当前商品的数目
            goods_count = $(this).children('.col06').text()
            goods_count = parseInt(goods_count)
            // 3.计算商品小计并设置
            total_price = goods_count*goods_price
            $(this).children('.col07').text(total_price.toFixed(2))

            goods_total_count += goods_count
            goods_total_price += total_price
        })
        // 设置商品的总数目和总价格
        $('.total_goods_count').children('em').text(goods_total_count)
        $('.total_goods_count').children('b').text(goods_total_price.toFixed(2)+'元')
        // 获取运费
        transit_price = $('.transit').children('b').text()
        transit_price = parseFloat(transit_price)
        //alert(transit_price)
        goods_total_price = goods_total_price + transit_price
        // 设置总额
        $('.total_pay').children('b').text(goods_total_price.toFixed(2)+'元')
    })
    </script>
{% endblock topfiles %}
{% block page_title %}提交订单{% endblock page_title %}
{% block body %}
	<h3 class="common_title">确认收货地址</h3>

	<div class="common_list_con clearfix">
		<dl>
			<dt>寄送到：</dt>
			<dd><input type="radio" name="addr_id" value="{{ addr.id }}" checked="">{{ addr.recipient_addr }} （{{ addr.recipient_name }} 收） {{ addr.recipient_phone }}</dd>
		</dl>
		<a href="{% url 'address' %}" class="edit_site">编辑收货地址</a>

	</div>
	
	<h3 class="common_title">支付方式</h3>	
	<div class="common_list_con clearfix">
		<div class="pay_style_con clearfix">
			<input type="radio" name="pay_style" value="1" checked>
			<label class="cash">货到付款</label>
			<input type="radio" name="pay_style" value="2">
			<label class="weixin">微信支付</label>
			<input type="radio" name="pay_style" value="3">
			<label class="zhifubao"></label>
			<input type="radio" name="pay_style" value="4">
			<label class="bank">银行卡支付</label>
		</div>
	</div>

	<h3 class="common_title">商品列表</h3>
	
	<div class="common_list_con clearfix">
		<ul class="goods_list_th clearfix">
			<li class="col01">商品名称</li>
			<li class="col02">商品单位</li>
			<li class="col03">商品价格</li>
			<li class="col04">数量</li>
			<li class="col05">小计</li>		
		</ul>
        {% for cart_info in cart_list %}
		<ul class="goods_list_td clearfix">
			<li class="col01">{{ forloop.counter }}</li>
			<li class="col02"><img src="{% static cart_info.goods.goods_image %}"></li>
			<li class="col03">{{ cart_info.goods.goods_name }}</li>
			<li class="col04">{{ cart_info.goods.goods_unite }}</li>
			<li class="col05">{{ cart_info.goods.goods_price }}元</li>
			<li class="col06">{{ cart_info.goods_count }}</li>
			<li class="col07">25.80元</li>	
		</ul>
		{% endfor %}
	</div>

	<h3 class="common_title">总金额结算</h3>

	<div class="common_list_con clearfix">
		<div class="settle_con">
			<div class="total_goods_count">共<em>2</em>件商品，总金额<b>42.60元</b></div>
			<div class="transit">运费：<b>10元</b></div>
			<div class="total_pay">实付款：<b>52.60元</b></div>
		</div>
	</div>

	<div class="order_submit clearfix">
        {% csrf_token %}
		<a href="javascript:;" cart_id_list="{{ cart_id_list }}" id="order_btn">提交订单</a>
	</div>
{% endblock body %}
{% block bottom %}
	<div class="popup_con">
		<div class="popup">
			<p>订单提交成功！</p>
		</div>
		
		<div class="mask"></div>
	</div>
{% endblock bottom %}
{% block bottomfiles %}
	<script type="text/javascript">
		$('#order_btn').click(function() {
		    // 1.获取addr_id, pay_style, cart_id_list
            addr_id = $('input[name="addr_id"]').val()
            pay_method = $('input[name="pay_style"]:checked').val()
            cart_id_list = $(this).attr('cart_id_list')
            csrf = $('input[name="csrfmiddlewaretoken"]').val()
            // alert(addr_id+':'+pay_method+':'+cart_id_list)
            // 发起一个ajax post请求
            params = {'addr_id':addr_id, 'pay_method':pay_method, 'cart_id_list':cart_id_list, 'csrfmiddlewaretoken':csrf}
            $.post('/order/commit/', params, function (data) {
                // {'res':0} 库存不足
                // {'res':1} 提交成功
                // {'res':2} 订单错误
                if (data.res == 0){
                    alert('库存不足')
                }
                else if (data.res == 2)
                {
                    alert('订单错误')
                }
                else
                {
                    // 订单成功
                    localStorage.setItem('order_finish',2);
                    $('.popup_con').fadeIn('fast', function() {
                        setTimeout(function(){
                            $('.popup_con').fadeOut('fast',function(){
                                window.location.href = '{% url 'user_order' '' %}';
                            });
                        },3000)

                    });
                }
            })
		});
	</script>
{% endblock bottomfiles %}
